<template>
  <el-dialog
    class="leave_dialog"
    :title="`班组详情`"
    :visible.sync="isOpen"
    :before-close="handleClose"
    :inline="true"
    center
  >
    <el-form ref="form" :model="teamInfo" label-width="100px">
      <el-row>
        <el-col :span="8">
          <el-form-item label="班组编号: " prop="teamCode">
            <span>{{ teamInfo.teamCode }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="班组名称: " prop="teamName">
            <span>{{ teamInfo.teamName }}</span>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="班组类型: " prop="calendarType">
            <span>{{ calendarTypeName }}</span>
          </el-form-item>
        </el-col>
      </el-row>
      <!-- <el-row>
        <el-col :span="8">
          <el-form-item label=": " prop="teamCode">
            <span>{{ teamInfo.teamCode }}</span>
          </el-form-item>
        </el-col>
      </el-row> -->
      <el-divider v-if="teamInfo.teamId != null" content-position="center"
        >项目组成员</el-divider
      >
      <Teammember
        v-if="teamInfo.teamId != null"
        optType="view"
        :teamId="teamInfo.teamId"
      ></Teammember>
    </el-form>
  </el-dialog>
</template>

<script>
import { getTeam } from "@/api/mes/cal/team";
import Teammember from "@/views/mes/cal/team/member.vue";

export default {
  name: "TeamDialog",
  props: {
    isOpen: {
      type: Boolean,
      default: false,
    },
    teamId: {
      type: Number,
    },
  },
  components: { Teammember },
  dicts: ["mes_calendar_type"],
  computed: {
    calendarTypeName() {
      const distList = this.dict.type.mes_calendar_type;
      const res = distList.find((dict) => {
        if (dict.value == this.teamInfo.calendarType) {
          return dict;
        }
      });
      if (res) {
        return res.label || "未知";
      }
      return "未知";
    },
  },
  data() {
    return {
      teamInfo: {},
    };
  },
  methods: {
    handleClose() {
      this.$emit("closeDialog");
    },
    getTeam(teamId) {
      getTeam(teamId).then((response) => {
        this.teamInfo = response.data;
      });
    },
  },
  watch: {
    teamId(newVal, oldVal) {
      this.getTeam(newVal);
    },
  },
};
</script>

<style></style>
